<template>
    <div>
        <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.13.2/skins/default/aliplayer-min.css" />
        <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.13.2/aliplayer-min.js"></script>
        <div class="prism-player" id="player-con"></div>
    </div>
</template>
<script>
import vodApi from '/api/vod'
    export default{
        asyncData({params,error}){
            return vodApi.getPlayAuth(params.vid).then(res=>{
                return{
                    vid:params.vid,
                    playauth:res.data,
                }
            })
        },
        mounted(){
            var player = new Aliplayer({
                "id": "player-con",
                "vid": this.vid,
                "playauth": this.playauth,
                "qualitySort": "asc",
                "format": "mp4",
                "mediaType": "video",
                "width": "100%",
                "height": "500px",
                "autoplay": false,
                "isLive": false,
                "rePlay": false,
                "playsinline": true,
                "preload": true,
                "controlBarVisibility": "hover",
                "useH5Prism": true
                }, function (player) {
                    console.log("The player is created");
                }
                );
        }
    }
</script>